mixin post(post)
  .am-g.post(id='accordion-' + post._id style={'margin-bottom': '2rem'})
    .am-u-md-4
      img(src='http://diw-612.com/images/files/' + post.image.filename).am-thumbnail
    .am-u-md-8
      h2= post.title
      .lead.text-muted
        span.am-icon-calendar-o
          |  掲載 
        if post.publishedDate
          | 于 #{post._.publishedDate.format('YYYY-MM-DD')}
      p!= post.content.brief
      if post.content.extended
        .am-panel
          .am-panel-hd(style={'padding-left': '0px'})
            a.am-panel-title(style={color: '#0e90d2'} data-id="#detail-" + post._id data-am-collapse="{parent: '#accordion-" + post._id + "', target: '#detail-" + post._id + "'}")
              | 表示/非表示
          .am-panel-collapse.am-collapse(id='detail-' + post._id)
            .content-wrap
              p!= post.content.extended

doctype html
html
  head
    meta(charset='utf-8')
    meta(http-equiv='X-UA-Compatible', content='IE=edge')
    meta(name='description', content='株式会社DIW(ディアイダブリュ)、日本のいいものを探し、世界中の人に使ってもらいたい。国際貿易、wechat宣伝、wechat広告、インバウンド事業、メディア事業、日本商品代理販売、wechat代行運営などをおこなっています')
    meta(name='keywords', content='DIW、国際貿易、wechat宣伝、wechat広告、wechat代行運営、インバウンド、中国貿易、爆買い、中国向け、中国市場、中国広告、越境ec、中国マーケティング')
    meta(name='viewport', content='width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no')
    title 株式会社DIW
    // Set render engine for 360 browser 
    meta(name='renderer', content='webkit')
    // No Baidu Siteapp
    meta(http-equiv='Cache-Control', content='no-siteapp')
    link(rel='icon', type='image/png', href='/i/favicon.png')
    // Add to homescreen 
    link(rel='manifest', href='manifest.json')
    // Fallback to homescreen for Chrome <39 on Android 
    meta(name='mobile-web-app-capable', content='yes')
    meta(name='application-name', content='株式会社DIW')
    link(rel='icon', sizes='192x192', href='/i/touch/chrome-touch-icon-192x192.png')
    // Add to homescreen for Safari on iOS 
    meta(name='apple-mobile-web-app-capable', content='yes')
    meta(name='apple-mobile-web-app-status-bar-style', content='black')
    meta(name='apple-mobile-web-app-title', content='株式会社DIW')
    link(rel='apple-touch-icon', href='/i/touch/apple-touch-icon.png')
    // Tile icon for Win8 (144x144 + tile color) 
    meta(name='msapplication-TileImage', content='/i/touch/ms-touch-icon-144x144-precomposed.png')
    meta(name='msapplication-TileColor', content='#0e90d2')
    // SEO: If your mobile URL is different from the desktop URL, add a canonical link to the desktop page https://developers.google.com/webmasters/smartphone-sites/feature-phones 
    //      
        <link rel="canonical" href="http://www.example.com/">

    link(href="/styles/site.min.css", rel="stylesheet")
  body
    header.am-topbar(data-am-sticky='')
      h1.am-topbar-brand
        a(href='/') DIW
      button.am-topbar-btn.am-topbar-toggle.am-btn.am-btn-sm.am-btn-primary.am-show-sm-only(data-am-collapse='{target: "#doc-topbar-collapse"}')
        span.am-sr-only 导航切换
        span.am-icon-bars
      .am-collapse.am-topbar-collapse#doc-topbar-collapse
        ul.am-nav.am-nav-pills.am-topbar-nav
          li
            a(href='/index')
              | トップ
              span.am-text-xs.am-text-primary - Top
          li
            a(href='/about')
              | Diwについて
              span.am-text-xs.am-text-primary - About
          li
            a(href='/service')
              | サービス一覧
              span.am-text-xs.am-text-primary - Service
          li
            a(href='/company')
              | 企業情報
              span.am-text-xs.am-text-primary - Company
          li
            a(href='/contact')
              | お問い合わせ
              span.am-text-xs.am-text-primary - Contact
    main
      section.diw-section.diw-summary
        .am-container
          h2.am-text-center 「日本のいいものを探し、世界中の人に使ってもらいたい。」
          p.am-text-center 日本の高品質・高性能な商品から、風情ある景色やおもてなしの心まで、日本のいいものを届けたい。
          p.am-text-center そんな思いから始まった株式会社ＤＩＷは、日々いいものを探求し配信しています。
          p.am-text-center 貿易と広告をコラボレーションさせながら、これからも「日本のいいもの」を世界中に届けます。
      h2.diw-section-title.am-text-center.am-text-xl サービス
      section.diw-section.diw-service
        .am-container
          .am-g
            .am-u-md-10.am-u-md-offset-1
              h2 中国に流行を作る
              p コスメ商品を中心に取り扱う貿易会社として株式会社DIWは2015年11月に設立しました。
              p 中国貿易にとって重要なことは、どこよりも早く有益な情報を発信し、いち早く流行を作ることです。
              p 私たちはその流行作成ツールとして、中国で最も有効なソーシャルメディアWeChatを使うことで、
              p 一瞬にして20万人以上のお客様に質のいい情報を提供することができるようになりました。
              p これからも日本の良い文化や良い商品を探求し、中国で流行を創り続けていきたいと強く思います。
          .am-g.diw-service-list
            .diw-service-item-wrap.am-u-md-4
              a.diw-service-item(href='/service#trade') 貿易事業
            .diw-service-item-wrap.am-u-md-4
              a.diw-service-item(href='/service#media') メディア事業
            .diw-service-item-wrap.am-u-md-4
              a.diw-service-item(href='/service#it') ＩＴ事業
      h2.diw-section-title.am-text-center.am-text-xl お知らせ
      section.diw-section.diw-news.no-padding.no-min-height
        ul.diw-news-list
          .am-container.news-list-wrap
            each post in data.posts.results
              +post(post)
        if data.posts.next
          .am-nbfc
            a#load-news.diw-news-more.am-center(href='')
              | もっと見る
              span.am-icon-caret-down
    footer.diw-footer
      .am-container
        .am-g
          section.am-u-md-5.am-u-md-offset-1
            h3 本社
            ul
              li 〒170-0013
              li 東京都豊島区東池袋1-36-7アルテール池袋612室
              li.diw-footer-tel Tel:03-6914-0310
              li.diw-footer-tel Fax:03-6914-0311
          section.am-u-md-5
            h3 物流センター
            ul
              li 〒33-0021
              li 埼玉県川口西川口4-3-2
              li.diw-footer-tel Tel:048-212-7016
              li.diw-footer-tel Fax:048-212-7016
    .diw-footer-bottom
      .am-container.am-text-center © Diw Co.,Ltd. All Rights Reserved.
    script(src='/js/jquery.min.js')
    script(src='/js/amazeui.min.js')
    script(src='/js/main.js')
    script.
      //格式化日期
      Date.prototype.Format = function (fmt) {
        var o = {
          "y+": this.getFullYear(),
          "M+": this.getMonth() + 1,                 //月份
          "d+": this.getDate(),                    //日
          "h+": this.getHours(),                   //小时
          "m+": this.getMinutes(),                 //分
          "s+": this.getSeconds(),                 //秒
          "q+": Math.floor((this.getMonth() + 3) / 3), //季度
          "S+": this.getMilliseconds()             //毫秒
        };
        for (var k in o) {
          if (new RegExp("(" + k + ")").test(fmt)) {
            if (k == "y+") {
              fmt = fmt.replace(RegExp.$1, ("" + o[k]).substr(4 - RegExp.$1.length));
            }
            else if (k == "S+") {
              var lens = RegExp.$1.length;
              lens = lens == 1 ? 3 : lens;
              fmt = fmt.replace(RegExp.$1, ("00" + o[k]).substr(("" + o[k]).length - 1, lens));
            }
            else {
              fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
            }
          }
        }
        return fmt;
      }
      
      $(function() {
        $('.diw-section .am-container').scrollspy({
          animation: 'slide-bottom',
          delay: 100,
          repeat: false
        })

        var currentNewsPage = 1;
        var $loadNewsBtn = $('#load-news');
        $loadNewsBtn.on('click', function (e) {
          e.preventDefault();

          if ($loadNewsBtn.is('.disabled')) {
            return;
          }
          $loadNewsBtn.addClass('disabled');
          $.get('/news', {
            page: currentNewsPage + 1,
          }, function (data) {
            currentNewsPage++;
            $loadNewsBtn.removeClass('disabled');
            console.log(data);
            for (var i = 0; i < data.posts.results.length; i++) {
              var itemInfo = data.posts.results[i];
              var itemHtml = '<div class="am-g post" id="accordion-${itemInfo._id}" style="margin-bottom:2rem;">' +
                            '<div class="am-u-md-4"><img class="am-thumbnail" src="http://diw-612.com/images/files/${itemInfo.image.filename}"></div>'+
                            '<div class="am-u-md-8">'+
                              '<h2>${itemInfo.title}</h2>'+
                              '<div class="lead text-muted"><span class="am-icon-calendar-o"> 掲載 </span>于 ${new Date(itemInfo.publishedDate).Format("yyyy-MM-dd")}</div>'+
                              '<p>${itemInfo.content.brief}</p>'+
                              '<div class="am-panel">'+
                                '<div class="am-panel-hd" style="padding-left:0px;">'+
                                  '<a class="am-panel-title" style="color:#0e90d2;" data-id="#detail-${itemInfo._id}" data-am-collapse="{parent: "#accordion-${itemInfo._id}", target: "#detail-${itemInfo._id}"}">表示/非表示</a>'+
                                 '</div>'+
                                '<div class="am-panel-collapse am-collapse" id="detail-${itemInfo._id}" style="height: 0px;">'+
                                  '<div class="content-wrap">'+
                                    '<p>${itemInfo.content.extended}</p>'+
                                  '</div>'+
                                '</div>'+
                              '</div>'+
                            '</div>'+
                          '</div>';
              $('.news-list-wrap').append(itemHtml);
              // 没有数据了
              if (data.posts.next === false) {
                $loadNewsBtn.remove();
              }
            }
          }).fail(function () {

          });
        });
      });
    // Built with love using Web Starter Kit 
